var petAndVisitDiv = 'petAndVisitDiv_'

//Remove existing divs
/*var divSelector= 'div[id^='+petAndVisitDiv+']'
$(divSelector).each(function() {
	$(this).remove()
})*/

//Write new divs
var afterMe = $('#afterMe')
var done = false
var i = 0
while(!done){
	var propertyName = petAndVisitDiv + i
	var nextPetDiv = window.data[propertyName]
	if(nextPetDiv == undefined) 
		done = true
	else{
       $('#'+propertyName).remove()
	   //Need to add the divs because they've been removed as part of the removal step above
	   nextPetDiv = "<div id='"+propertyName+"' class='replaceMe'>" + nextPetDiv + "</div>"
	   $(nextPetDiv).insertAfter(afterMe)
	   //highlight(propertyName)
	   afterMe = $('#' + propertyName)
	   i++
	}

}

//Make new forms remotable
//CHUCK TODO  This should probably be done by liveQuery plugin. See 'jQuery In Action' book
var editForm = 'editPetForm_'
var visitForm = 'addVisitForm_'

var petAndVisitDiv = 'petAndVisitDiv_'

var editFormSelector = 'form[id^='+editForm+']'
var visitFormSelector = 'form[id^='+visitForm+']'
$(editFormSelector).each(function() {
	$.remoteForm(this.id)
})
$(visitFormSelector).each(function() {
	$.remoteForm(this.id)
})

//Doesn't make IE6 look any better when IE6 has lots of pets and the screen flashes
/*function highlight(id){
	$('#' + id).fadeOut('slow'); 
	$('#' + id).fadeIn('slow'); 
}*/

